import { map, mountMap, setSpaceDataByPngs } from './core/index'
import './global/menu'
import airspace from './assets/airspace.json'
import airports from './assets/airport.json'
import airlines from './assets/airline.json'
import { Airspace } from './core/MapElement/Airspace';
import { Airport } from './core/MapElement/Airport';
import { Popup } from './core/MapElement/Popup';
import { AirLine } from './core/MapElement/Airline'
// import { Sprite, SpriteMaterial } from 'three';

mountMap('app');

// 添加空域
airspace.forEach(e => {
  new Airspace(map, {
    show: true,
    name: e.name,
    points: e.points.map(e => [e.lon, e.lat]),
    height: [e.height - 2000, e.height + 2000],
    risk: 0
  })
})

const html = document.createElement('div')
html.style.color = '#ffffff'
html.style.padding = '10px'

const airportPopup = new Popup(map, {
  name: '机场弹框',
  show: true,
  html,
  color: '#ffffff',
  closeOnMouseLeave: true,
  distance: 10,
  position: 0
})

// 添加机场
airports.data.forEach(e => {
  const airport = new Airport(map, {
    name: e.name,
    show: true,
    lon: e.lon,
    lat: e.lat,
    alt: e.altitude,
    risk: 0,
    onClick() {
      airport.focus()
      console.log(e);
    },
    onMouseEnter() {
      airportPopup.option.html.innerText = JSON.stringify(e)
      airportPopup.showAt(e.lon, e.lat, e.altitude)
    },
    onMouseLeave() {
      airportPopup.hide()
    },
  })
});

// 添加航线
airlines.forEach(e => {
  new AirLine(map, {
    name: e.name,
    show: true,
    points: e.points.map(e => ({
      lat: e.lat,
      lon: e.lon,
      name: e.name
    })),
    risks: Array.from({
      length: e.points.length - 1,
    }, () => Math.floor(Math.random() * 4)),
    height: e.height
  })
})

// 设置空间数据

setSpaceDataByPngs(Array.from({
  length: 29
}, (_, i) => {
  const h = i * 500
  return [h, `./temperature/${h}.png`]
}),500)